<template>
  <div>
    <editForm :formConfig="formConfig" ref="editForm" :formData="editFormData">
    </editForm>
    <div style="text-align: left">
      <i class="el-icon-question" style="color: #81d3f8; font-size: 20px"></i
      ><i>提示：排班开始时间保存后不允许修改，请考虑好填写</i>
    </div>
  </div>
</template>

<script>
export default {
  props: {
    formData: {
      type: Object,
      default: () => {
        return {};
      },
    },
  },
  data() {
    return {
      title: "",
      show: false,
      disabled: false,
      department: "",
      searchData: {},
      formConfig: {
        labelWidth: "120px",
        itemArr: [
          {
            label: "方案名称",
            prop: "name",
            type: "text",
            span: 24,
            placeholder: "请选择或直接输入",
            disabled: false,
            required: true,
          },
          {
            label: "值班单位",
            prop: "deptName",
            type: "text", //类型
            span: 12,
            disabled: true,
            required: true,
          },
          {
            label: "班别方案",
            prop: "classesName",
            type: "text",
            span: 12,
            disabled: true,
            required: true,
          },
          {
            label: "值班地点",
            prop: "locationName",
            type: "text",
            disabled: true,
            required: true,
            span: 12,
          },
          {
            label: "排班开始时间",
            prop: "startTime",
            type: "date",
            span: 12,
            required: true,
            disabled: false,
            dateFormat: "yyyy-MM-dd HH:mm",
            methods: (val) => {
              let time = `${val.split(" ")[0]} ${this.startTime}`;
              this.$refs.editForm.setFormItem("startTime", time);
              let timeLength =
                new Date(time).getTime() -
                new Date(this.formData.startTime).getTime();
              let endTime =
                this.shiftList.length > 0
                  ? this.computedTime(this.formData.endTime, timeLength)
                  : "";
              this.$refs.editForm.setFormItem("endTime", endTime);
            },
          },
          {
            label: "自动交接班",
            prop: "autoSwitch",
            type: "radio",
            span: 12,
            required: true,
            disabled: false,
            radioOption: [
              { label: "是", value: 1 },
              { label: "否", value: 0 },
            ],
          },
        ],
      },
      //弹出框表单数据
      editFormData: {
        advanceShiftTime: 15,
        advanceShiftUnit: "0",
      },
      startTime: "",
    };
  },
  created() {
    this.initData();
  },
  methods: {
    initData() {
      let data = JSON.parse(JSON.stringify(this.formData));
      delete data.id;
      data.startTime = null;
      data.autoSwitch = null;
      this.shiftList = data.shiftList;
      this.shiftList.forEach((item) => {
        item.forEach((shift) => {
          delete shift.id;
          shift.staffs.forEach((staff) => {
            delete staff.id;
          });
        });
      });
      this.startTime = data.items[0].startTime;
      this.editFormData = data;
    },
    //复制
    copy() {
      let formData = this.$refs.editForm.getCurrentData();
      let data = JSON.parse(JSON.stringify(this.shiftList));
      let timeLength =
        new Date(formData.startTime).getTime() -
        new Date(this.formData.startTime).getTime();
      data.forEach((item) => {
        item.forEach((shift, index) => {
          shift.startTime = this.computedTime(shift.startTime, timeLength);
          shift.endTime = this.computedTime(shift.endTime, timeLength);
          shift.status = 0;
        });
      });
      return data;
    },
    //计算结束时间
    computedTime(startTime, dutyTime) {
      let times = new Date(startTime).getTime() + dutyTime;
      return this.$utils.TimeFormat(times, 3);
    },
    async getFormData() {
      let formData = await this.$refs.editForm.getFormData();
      formData.shiftList = this.copy();
      return formData;
    },
  },
};
</script>

<style lang="less" scoped></style>
